<template>
	<view class="container">
		
		<!-- 反馈类型 -->
		<view class="ft">
			<text class="ft_type">
				反馈问题类型
			</text>
			<view class="ft_detail">
				<!-- <u-button size="mini" :custom-style="customBtnStyle" shape="circle">国家奖学金</u-button>
				<u-button size="mini" :custom-style="customBtnStyle" shape="circle">国家励志奖学金</u-button>
				<u-button size="mini" :custom-style="customBtnStyle" shape="circle">国家助学金</u-button>
				
				<u-button size="mini" :custom-style="customBtnStyle" shape="circle">新生资助</u-button>
				
				<u-button size="mini" :custom-style="customBtnStyle" shape="circle">其他</u-button>
				</view> -->
				<u-input v-model="ft.type" type="select" class="fs"  @click="show = true" placeholder="请选择咨询反馈类型"/>
			</view>
		</view>
		<view class="ft_content">
			<view class="ft_title_input">
				<text>请输入反馈主题</text>
				<u-input v-model="ft.title" type="text" :border="true"  placeholder="请输入"/>
			</view>
			<view class="ft_content_input">
				<text>请输入反馈正文</text>
				<u-input v-model="ft.content" height="140" type="textarea" maxlength="300" :border="true"  placeholder="请输入"/>
			</view>
		</view>
		
		<view class="sub">
			<u-button type="primary" @click="sub">提交</u-button>
		</view>
		
		<view class="footer">
			<view @click="navMyFb" class="btn">
				<text >我的反馈</text>
			</view>
		</view>
		
		<u-picker v-model="show" mode="selector" :range="list1" @confirm="onType"></u-picker>
	</view>
</template>

<script>
	var that; // 当前页面对象
	var vk; // vk依赖
	export default {
		data() {
			return {
				access_token:'',
				show:false,
				ft_titleTypeVal:'',
				ft:{
					type:'',
					title:'',
					content:''
				},
				customBtnStyle:{
					marginLeft:'10rpx',
					height:'60rpx',
					marginTop:'14rpx',
					background:'#0055ff',
					
				},
				list1:[
					'其他','国家奖学金','国家励志奖学金','国家助学金','新生资助'
				]
			}
		},
		onLoad(options) {
			// vk框架初始化
			that = this;
			vk = that.vk;
			that.options = options;
			this.access_token = vk.getStorageSync('yibanInfo').access_token;
			if(!this.access_token){
				uni.showModal({
					title:'提示',
					content:'未授权或授权过期',
					success: (res) => {
						if(res.confirm){
							location.href = 'https://openapi.yiban.cn/oauth/authorize?client_id=614fe373b8d36e16&redirect_uri=https://pyplwf.cn&state=lwf'
						}
					}
				})
			}
		},
		methods: {
			onType(e){
				
				this.ft.type = this.list1[e[0]]
				
			},
			sub(){
				let form = Object.values(this.ft)
				for (let s of form) {
					if(s == ''){
						uni.showToast({
							icon:'error',
							title:'请完善输入内容'
						})
						return
					}
					
				}
				let yb_userid = vk.getStorageSync('yibanInfo').user.info.yb_userid;
				vk.callFunction({
					url: 'client/feedback/pub/add',
					title:'请求中...',
					data:{
						yb_userid,
						...this.ft
					},
					success:function(data){
						console.log(data)
						//授权过期或授权不存在，重新授权
						
						uni.showModal({
							title:'提交成功',
							content:'请留意批复进度',
							confirmText:'查看进度',
							success: (res) => {
								if(res.confirm){
									//跳转到进度页面
									vk.navigateTo('myfeedback');
								}
							}
						})
					},
					fail:function(err){
						if(err.code == 404){
							uni.showModal({
								title:'提示',
								content:'未授权或授权过期',
								success: (res) => {
									if(res.confirm){
										location.href = 'https://openapi.yiban.cn/oauth/authorize?client_id=614fe373b8d36e16&redirect_uri=https://pyplwf.cn&state=lwf'
									}
								}
							})
							return
						}
						else {
							vk.alert(err.msg);
						}
					}
				});
				
				
				
			},
			navMyFb(){
				console.log('点击了我的反馈')
				vk.navigateTo('myfeedback');
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	.container {
		padding: 40rpx;
		.fs {
			font-size: 16px;
		}
		.ft {
			padding: 10rpx;
			font-size: 16px;
			color: #8c8c8c;
			.ft_detail {
				margin-top: 20rpx;
				
			}
		}
		.ft_content {
			.ft_title_input {
				text {
					padding: 10rpx;
					font-size: 16px;
					color: #8c8c8c;
				}
			}
			.ft_content_input {
				margin-top: 30rpx;
				text {
					padding: 10rpx;
					font-size: 16px;
					color: #8c8c8c;
				}
			}
		}
		.sub {
			margin-top: 60rpx;
		}
		
		.footer {
			
			margin-top: 100rpx;
			display: flex;
			justify-content: center;
			.btn {
				padding: 30rpx;
			}
			text{
				color: #2979ff;
				
				
			}
			text:active{
				background-color: #cccccc;
				
			}
		}
	}
</style>
